<template>
	<div class="container2">
		<div class="main-c">
			<div class="main-head">
				<h2>{{`${siteName}管理系统`}}</h2>
				<p class="title-1">代理人登录</p>
			</div>
			<div class="login-form">
				<el-input placeholder="手机号码" prefix-icon="el-icon-user" v-model="phone"></el-input>
				<el-input placeholder="密码" type="password" prefix-icon="el-icon-lock" v-model="password"></el-input>
				<el-button v-no-more-click:3000 type="primary" class="btn-login" @click="login">登入</el-button>
			</div>
		</div>
	</div>
</template>
<script>
	import {prelogin} from '~/api/login'
	import {validation} from './validate'
	import aes from '~/util/aes.js'
	import { SITE_NAME, SITE_NAME_PY } from '~/util/config'
	export default {
		name:'adminLogin',
		head: {
			title:'代理人登录-专利服务管理系统'
		},
		data() {
			return {
				phone: "",
				password: "",
				siteName: SITE_NAME,
				siteNamePY: SITE_NAME_PY,
			}
		},
		created(){
			if(this.$route.params.phone){
				this.phone=this.$route.params.phone;
			}
		},
		methods: {
			login() {
				let that = this;
				//效验
				let validationError = validation({
					phone: that.phone,
					password: that.password
				})
				if (validationError === '') {
					prelogin(that.$axios,{
						phone: that.phone,
						password: that.password
					})
					.then(res=>{
						if(res.data.code==200){
							that.$cookies.remove('user');
							that.$cookies.remove('token');
							that.$cookies.set('agent',aes.Encrypt(JSON.stringify(res.data.data)));
							that.$store.commit("setAgent",res.data.data);
							if(that.$route.query.from){
								that.$router.push(that.$route.query.from);
							}else{
								that.$router.push('/admin/agentCenter');
							}
						}else{
							that.$message({
								message: res.data.message,
								type: 'error'
							});
						}
					})
				} else {
					that.$message({
						message: validationError,
						type: 'warning'
					});
				}
			}
		},
		mounted(){
			if(this.$route.query.from){
				this.$message({
					message: '您还没有登录',
					type: 'warning'
				});
			}
		}
	}
</script>


<style lang="less">
	.container2 {
		margin: 0 auto;
		min-height: 100vh;
		background-color: #f2f2f2;
		.main-c {
			width: 100%;
		}

		.main-c .main-head,
		.login-form {
			width: 375px;
			margin: 0 auto;
			text-align: center;
			padding-top: 20px;
		}

		.main-head {
			height: 109px;
		}

		.main-head h2 {
			font-weight: 300;
			font-size: 30px;
			color: #000;
			margin: 0;
			padding-top: 20px;
		}

		.main-head .title-1 {
			font-weight: 300;
			color: #999;
		}

		.main-c .login-form {
			// height: 200px;
		}
		.login-form .el-input {
			margin-bottom: 15px;
		}

		.login-form .btn-login {
			width: 100%;
			margin-bottom: 30px;
		}
	}
</style>



